<template>
    <div >
        <div class="item1">
            <div style="display: flex;width: 80%;height: 26px">
                <el-input v-model="Search" placeholder="搜索" style="width: 80%" clearable/>
                <el-button type="primary" @click="load">搜索</el-button>
            </div>
        </div>
        <div style="height: 80px;width: 100%"></div>
        <div class="box" v-for="item in goodsData" >
            <div class="item2" @click="lookup(item)" v-if="item.fwq==fwq">
                <div style="flex: 1"><h3>{{item.name}}</h3><div>{{item.property}}</div></div>
                <div style="width: 70px">价格：{{item.price}}</div>
                <div style="width: 50px">{{item.priceUnit}}</div>
            </div>
        </div>
    </div>
</template>

<script>
    import request from "../../network/request";

    export default {

        name: "SearchYM",
        data(){
            return{
                Search:[],
                detail:{},
                Vis:false,
                pageSize:1000,
                total:0,
                fwq:'无尽之海',
                goodsData:[],
            }
        },
        created() {
            this.Search= this.$route.query.data
            this.fwq=this.$route.query.fwq
            this.load()
        },
        methods:{
            lookup(item){
                this.$router.push({
                        path:'/goodsDetails',
                        query: {
                            data: [item.name,
                                item.price,
                                item.img,
                                item.fwq,
                                item.address,
                                item.priceUnit,
                                item.number,
                                item.author,
                                item.property,
                                item.bsProperty]
                        }
                    }
                )
            },
            load(){
                request.get("/goods",{
                    params:{
                        pageNum:this.currentPage,
                        pageSize:this.pageSize,
                        search:this.Search,
                    }
                }).then(res => {
                    this.goodsData = res.data.records
                })
            },
            openBlog(item){
                this.detail = item
                this.Vis = true
            },
        },
    }
</script>

<style scoped>
    .item1{
        background-color: #f6f6f6;
        height: 70px;
        display: flex;
        justify-content: space-around;
        align-items: center;
        box-shadow: 0 1px 1px rgba(100,100,100,.1);
        position: fixed;z-index: 1;width: 100%;
    }
    .item2{
        display: flex;
        align-items: center;
        justify-content: space-around;
        flex: 1;
        margin-top: 10px;
        background-color: #f6f6f6;
    }
</style>